import React from 'react';
import './index.css';

const matches = [
  { id: 1, teamA: '红队', teamB: '蓝队', date: '2024-06-01', time: '14:00-15:30', location: '主场球场' },
  { id: 2, teamA: '黄队', teamB: '绿队', date: '2024-06-02', time: '16:00-17:30', location: '体育中心' },
  { id: 3, teamA: '黑队', teamB: '白队', date: '2024-06-03', time: '19:00-20:30', location: '训练场' },
];

function MatchList() {
  return (
    <div className="player-list-container">
      <h2>比赛列表</h2>
      <table className="player-table">
        <thead>
          <tr>
            <th>主队</th>
            <th>客队</th>
            <th>日期</th>
            <th>时间</th>
            <th>地点</th>
          </tr>
        </thead>
        <tbody>
          {matches.map(match => (
            <tr key={match.id}>
              <td>{match.teamA}</td>
              <td>{match.teamB}</td>
              <td>{match.date}</td>
              <td>{match.time}</td>
              <td>{match.location}</td>
            </tr>
          ))}
        </tbody>
      </table>
    </div>
  );
}

export default MatchList; 